@reference "../../../assets/index.css";

[data-cplx-component="cplx-main-query-box"],
[data-cplx-component="cplx-space-query-box"],
[data-cplx-component="cplx-follow-up-query-box"],
[data-cplx-component="cplx-comet-assistant-query-box"] {
  &
    + [data-scope="popover"]
    > [data-slash-command-menu-content][data-placement="bottom"] {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
  }

  &
    + [data-scope="popover"]
    > [data-slash-command-menu-content][data-placement="top"] {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
  }

  &:has(
    + [data-scope="popover"]
      > [data-slash-command-menu-content][data-placement="bottom"]
  ) {
    .bg-raised {
      border-bottom-left-radius: 0;
      border-bottom-right-radius: 0;
      @apply x:border-[1.5px] x:border-b-0 x:border-border;
    }
  }

  &:has(
    + [data-scope="popover"]
      > [data-slash-command-menu-content][data-placement="top"]
  ) {
    .bg-raised {
      border-top-left-radius: 0;
      border-top-right-radius: 0;
      @apply x:border-[1.5px] x:border-t-0 x:border-border;
    }
  }
}

[data-slash-command-menu-content][data-placement="bottom"] {
  box-shadow:
    0 4px 6px -1px rgb(0 0 0 / 0.1),
    0 2px 4px -2px rgb(0 0 0 / 0.1);
}

[data-slash-command-menu-content][data-placement="top"] {
  box-shadow:
    0 -4px 6px -1px rgb(0 0 0 / 0.1),
    0 -2px 4px -2px rgb(0 0 0 / 0.1);
}
